<!-- eslint-disable @typescript-eslint/no-unused-vars -->
<!-- eslint-disable prettier/prettier -->
<template>
  <div>
    <div class="card content-box">
      <span class="text">任务模板管理</span>
      <el-divider></el-divider>
      <!--搜索-->
      <div class="mt-4" style="display: flex">
        <el-input v-model="input" style="max-width: 600px" placeholder="输入模板名搜索" class="input-with-select">
          <template #prepend>
            <el-select v-model="select" placeholder="筛选" style="width: 115px">
              <el-option label="任务模版名" value="1" />
              <!--              <el-option label="负责班组名" value="2" />-->
              <!--              <el-option label="创建者" value="3" />-->
            </el-select>
          </template>
          <template #append>
            <el-button :icon="Search" @click="handleSearch" />
          </template>
        </el-input>
        <el-button :icon="Refresh" @click="cancelSearch" style="margin-left: 10px" />
      </div>
      <div style="width: 100%; display: flex; justify-content: start">
        <el-button type="primary" @click="addClick">添加模板</el-button>
      </div>
      <br />
      <!--展示机构列表-->
      <el-table :data="tableData" border class="custom-table" style="width: 100%" :default-sort="{ prop: 'inspectionDate', order: 'descending' }">
        <el-table-column type="selection" :selectable="selected" width="55" />
        <el-table-column label="序号" width="100" type="index"> </el-table-column>
        <el-table-column label="任务名称" prop="inspectionName"></el-table-column>
        <el-table-column label="创建时间" prop="inspectionDate" sortable></el-table-column>
        <el-table-column label="创建者">
          <template #default="scope">
            <text>{{ getUserInfo(scope.row.inspectionUserId) }}</text>
          </template>
        </el-table-column>
        <el-table-column label="操作" width="200">
          <!--#default="{ row }"-->
          <template #default="{ row }">
            <el-button @click="getDetailClick(row)" size="small">查看</el-button>
            <el-button type="primary" @click="editClick(row)" size="small">编辑</el-button>
            <el-button type="danger" @click="delTask(row)" size="small">删除</el-button>
          </template>
        </el-table-column>
        <template #empty>
          <el-empty description="空空如也" />
        </template>
      </el-table>
      <br />
      <!--分页 后面要根据数据算-->
      <div style="width: 100%; display: flex; justify-content: end">
      <el-pagination
        :current-page="searchData.current"
        :page-size="searchData.limit"
        :total="total"
        :pager-count="7"
        layout="jumper, prev, pager, next, total"
        @current-change="getData"
      /></div>
    </div>

    <!--任务详情抽屉-->

    <el-drawer v-model="show_task" size="30%">
      <div>
        <!--任务信息-->
        <el-card style="max-width: 100%">
          <template #header>{{ taskDetail.inspectionName }}</template>
          <div class="common-layout">
            <el-container>
              <el-main>
                <el-descriptions title="" :column="1" border>
                  <el-descriptions-item label="任务名称" align="center">
                    {{ taskDetail.inspectionName }}
                  </el-descriptions-item>
                  <el-descriptions-item label="巡检路线" align="center">
                    {{ getMapInfo(taskDetail.inspectionMapId) }}
                  </el-descriptions-item>
                  <el-descriptions-item label="创建者" align="center">
                    {{ getUserInfo(taskDetail.inspectionUserId) }}
                  </el-descriptions-item>
                </el-descriptions>
                <el-divider></el-divider>
                <el-table :data="taskDetail.inspectionDatas" class="custom-table" border style="width: 100%">
                  <el-table-column label="序号" type="index"> </el-table-column>
                  <el-table-column prop="mapDetailDesc" label="点位名" />
                  <el-table-column prop="inspectionDataName" label="点位任务名" />
                  <el-table-column prop="inspectionDataDesc" label="任务描述" />
                  <el-table-column prop="inspectionGroupId" label="数据组">
                    <template #default="scope">
                      <text>{{ getDataInfo(scope.row.inspectionGroupId) }}</text>
                    </template> </el-table-column>>
                </el-table>
              </el-main>
            </el-container>
          </div>
        </el-card>
      </div>
    </el-drawer>

    <!--任务修改抽屉 -->
    <el-drawer v-model="show_edit" title="任务模板信息" :append-to-body="true" size="30%">
      <el-form :model="taskForm" label-width="100px">
        <el-card>
          <el-form-item label="任务名称">
            <el-input v-model="taskForm.inspectionName" placeholder="请输入名称"></el-input>
          </el-form-item>
          <el-form-item>
            <el-button type="primary" @click="editTask">修改</el-button>
            <el-button type="info" @click="show_edit = false">取消</el-button>
          </el-form-item>
        </el-card>
      </el-form>
    </el-drawer>

    <!-- 添加任务弹窗 -->
    <el-dialog v-model="add_task_commit" width="50%">
      <!--展示模式-->
      <el-descriptions title="任务详情" direction="vertical" :column="2" border>
        <el-descriptions-item label="任务名称">{{ taskForm.inspectionName }}</el-descriptions-item>
        <el-descriptions-item label="巡检地图">{{ getMapInfo(taskForm.inspectionMapId) }}</el-descriptions-item>
      </el-descriptions>
      <el-descriptions title="地图点位" direction="vertical" :column="1" border> </el-descriptions>
      <el-table :data="taskForm.inspectionDatas" style="width: 100%">
        <el-table-column prop="mapDetailName" label="点位名" width="180" />
        <el-table-column prop="unitName" label="机组"/>
        <el-table-column prop="inspectionDataName" label="点位任务名称" width="180" />
        <el-table-column prop="inspectionDataDesc" label="任务描述" />
        <el-table-column prop="inspectionGroupId" label="数据组">
          <template #default="scope">
            <text>{{ getDataInfo(scope.row.inspectionGroupId) }}</text>
          </template>
        </el-table-column>
      </el-table>

      <template #footer>
        <span class="dialog-footer">
          <el-button
            @click="
              add_task_commit = false;
              two = true;
            "
            >上一步</el-button>
          <el-button type="primary" @click="addtask"> 创建 </el-button>
        </span>
      </template>
    </el-dialog>

    <!--详情展示-->

    <!--二级窗口-->
    <el-dialog v-model="one" title="任务基本信息" width="50%">
      <!--编辑模式-->
      <el-form :model="taskForm" label-width="130px" style="padding-right: 30px" v-if="one" :rules="addRules" ref="addFormRef">
        <el-form-item label="任务名称" prop="inspectionName">
          <el-input v-model="taskForm.inspectionName"></el-input>
        </el-form-item>
        <el-form-item label="选择路线" prop="inspectionMapId">
          <el-select v-model="taskForm.inspectionMapId" placeholder="选择">
            <el-option v-for="item in maps" :key="item.mapId" :label="item.mapName" :value="item.mapId" />
          </el-select>
        </el-form-item>
      </el-form>
      <template #footer>
        <span class="dialog-footer">
          <el-button @click="one = false">取消</el-button>
          <el-button type="primary" @click="Next1()"> 下一步 </el-button>
        </span>
      </template>
    </el-dialog>

    <el-dialog v-model="two" title="点位配置" width="50%">
      <div>
        <el-table :data="taskForm.inspectionDatas" style="width: 100%" border>
          <el-table-column prop="mapDetailName" label="点位名"></el-table-column>
          <el-table-column prop="unitName" label="机组"></el-table-column>
          <el-table-column prop="inspectionDataName" label="点位任务名称">
            <template #default="scope">
              <el-input v-model="scope.row.inspectionDataName" placeholder="点位任务名称"></el-input>
            </template>
          </el-table-column>
          <el-table-column prop="inspectionDataDesc" label="任务描述">
            <template #default="scope">
              <el-input v-model="scope.row.inspectionDataDesc" placeholder="点位任务描述"></el-input>
            </template>
          </el-table-column>
          <el-table-column prop="inspectionGroupId" label="数据组">
            <template #default="scope">
              <el-select v-model="scope.row.inspectionGroupId" placeholder="选择数据组">
                <el-option
                  v-for="item in datas"
                  :key="item.inspectionGroupId"
                  :label="item.inspectionGroupName"
                  :value="item.inspectionGroupId"
                >
                </el-option>
              </el-select>
            </template>
          </el-table-column>
        </el-table>
        <!-- <el-button @click="addRow1" type="primary">添加行</el-button> -->
      </div>
      <template #footer>
        <span class="dialog-footer">
          <el-button
            @click="
              two = false;
              one = true;
            "
            >上一步
          </el-button>
          <el-button type="primary" @click="Next2()"> 下一步 </el-button>
        </span>
      </template>
    </el-dialog>
  </div>
</template>

<script setup lang="ts" name="departmentManage">
import { onMounted, ref, watch, reactive } from "vue";
import { Search, Refresh } from "@element-plus/icons-vue";
import { ElMessage, ElMessageBox } from "element-plus";
import { getDataService } from "@/api/inspection/datas";
import { getPointService, getAllMapService } from "@/api/inspection/map"; // ,
import { getAllClassService, getClassMemberService } from "@/api/systemManage/class";
import { tempSearchService } from "@/api/systemManage/search";
import { getAllTempService, getTempDetService, delTempService } from "@/api/inspection/task";
import { useUserStore } from "@/stores/modules/user";
import { getAllWorkerService } from "@/api/systemManage/user";
import type { FormInstance } from "element-plus";
import http from "@/utils/http";
import request from "@/api/request";

//控制变量
//const add_task = ref(false);
const userStore = useUserStore();

const show_task = ref(false);
const show_edit = ref(false);
// const isSure = ref(false);
// const sureContext = ref("");
const addFormRef = ref<FormInstance | null>(null);
const addRules = {
  inspectionName: [{ required: true, message: "请输入任务模板名称", trigger: "blur" }],
  inspectionMapId: [{ required: true, message: "请选择路线", trigger: "blur" }],
  inspectionClassId: [{ required: true, message: "请选择班组", trigger: "blur" }]
};
//三级 改为二级
const one = ref(false);
const two = ref(false);
//const three = ref(false);
const add_task_commit = ref(false);
//用户搜索输入
const input = ref("");
const select = ref("1");
//数据模型
//任务
const tasks = ref([
  {
    inspectionId: "29111",
    inspectionName: "一号炉A线",
    inspectionDate: "2024-1-23",
    inspectionUserId: "admin1",
    inspectionClassId: "1322",
    inspectionMapId: "123411"
  }
]);

const searched = ref([
  {
    inspectionId: "29111",
    inspectionName: "一号炉A线",
    inspectionDate: "2024-1-23",
    inspectionUserId: "admin1",
    inspectionClassId: "1322",
    inspectionMapId: "123411"
  }
]);

// 定义 mapDetailVO 接口
interface MapDetailVO {
  mapDetailId: number | null;
  mapId: number | null;
  mapLongitude: string;
  mapLatitude: string;
  unitName: string;
  mapDetailDesc: string;
  mapNfcMsg: string;
}

// 定义 inspectionData 接口
interface InspectionData {
  inspectionDataDesc: string;
  inspectionDataId: number | null;
  inspectionDataName: string;
  inspectionGroupId: number | null;
  inspectionId: number | null;
  mapDetailId: number | null;
}

// 定义整体 Task 接口
interface Task {
  mapDetailVO: MapDetailVO;
  inspectionData: InspectionData;
}

const task = ref<Task[]>([
  {
    mapDetailVO: {
      mapDetailId: 0,
      mapId: 0,
      mapLongitude: "",
      mapLatitude: "",
      unitName: "",
      mapDetailDesc: "",
      mapNfcMsg: ""
    },
    inspectionData: {
      inspectionDataDesc: "",
      inspectionDataId: 0,
      inspectionDataName: "",
      inspectionGroupId: 0,
      inspectionId: 0,
      mapDetailId: 0
    }
  }
]);
interface inspectionDatas {
  mapDetailId: number | null;
  inspectionGroupId: number | null;
  inspectionDataDesc: string;
  inspectionDataName: string;
  unitName?: string;
  mapDetailName: string;
}

interface taskForm {
  inspectionId: number | null;
  inspectionUserId: number | null;
  inspectionClassId: string;
  inspectionName: string;
  inspectionMapId: string;
  unitName?: string;
  inspectionDatas: inspectionDatas[];
}

//创建修改提交
const taskForm = ref<taskForm>({
  inspectionId: null,
  inspectionUserId: 0,
  inspectionClassId: "",
  inspectionName: "",
  inspectionMapId: "",
  unitName: "",
  inspectionDatas: [
    {
      mapDetailId: 0,
      inspectionGroupId: null,
      inspectionDataDesc: "",
      inspectionDataName: "",
      mapDetailName: ""
    }
  ]
});
const clearForm = () => {
  taskForm.value = {
    inspectionId: null,
    inspectionUserId: null,
    inspectionClassId: "",
    inspectionName: "",
    inspectionMapId: "",
    inspectionDatas: []
  };
  console.log("完成清理" + taskForm.value);
};
const clearForm2 = () => {
  taskForm.value.inspectionDatas = [];
  console.log("完成清理" + taskForm.value);
};

// 创建一个函数将 task 中同名字段的值赋给 taskForm
const assignTaskToTaskForm = () => {
  // 遍历 task 的所有对象
  task.value.forEach((taskItem, index) => {
    // 如果 taskForm 的 inspectionDatas 长度小于当前索引，则增加新的对象
    while (taskForm.value.inspectionDatas.length <= index) {
      taskForm.value.inspectionDatas.push({
        mapDetailId: 0,
        inspectionGroupId: 0,
        inspectionDataDesc: "",
        inspectionDataName: "",
        mapDetailName: taskItem.mapDetailVO["mapDetailDesc"]
      });
    }
    // 确保 taskItem.inspectionData 存在
    if (taskItem.inspectionData) {
      // 逐一赋值同名字段
      Object.keys(taskItem.inspectionData).forEach(key => {
        if (key in taskForm.value.inspectionDatas[index]) {
          //console.log("key1" + taskItem.inspectionData[key]);
          taskForm.value.inspectionDatas[index][key] = taskItem.inspectionData[key];
          //console.log("key2" + taskForm.value.inspectionDatas[index][key]);
        }
      });
    }
  });
};

const assignMapPointsToTaskForm = () => {
  clearForm2();
  // 遍历 task 的所有对象
  map_points.value.forEach((taskItem, index) => {
    while (taskForm.value.inspectionDatas.length <= index) {
      taskForm.value.inspectionDatas.push({
        mapDetailId: taskItem["mapDetailId"],
        inspectionGroupId: null,
        inspectionDataDesc: "",
        inspectionDataName: "",
        unitName: taskItem["unitName"],
        mapDetailName: taskItem["mapDetailDesc"]
      });
    }
    // 逐一赋值同名字段
    // Object.keys(taskItem).forEach(key => {
    //   if (key == "mapDetailDesc") {
    //     //console.log("同" + taskItem.mapDetailDesc);
    //     taskForm.value.inspectionDatas[index].inspectionDataDesc = taskItem.mapDetailDesc;
    //   }
    //   // 如果 taskForm.inspectionDatas 中有同名字段则赋值
    //   else if (key in taskForm.value.inspectionDatas[index]) {
    //     // 处理特定字段的赋值
    //     taskForm.value.inspectionDatas[index][key] = taskItem[key];
    //   }
    // });
  });
};

const datas = ref([
  {
    inspectionGroupName: "",
    inspectionGroupId: 0
  }
]);

const map_points = ref([
  {
    mapDetailId: 0,
    unitName: "一号反应堆",
    mapId: 0,
    mapLatitude: "",
    mapLongitude: "",
    mapDetailDesc: "需要检查该反应堆外表，记录数据组参数",
    map_nfc_msg: ""
  }
]);

const maps = ref([
  {
    mapDate: "",
    mapId: 0,
    mapName: ""
  }
]);

const groups = ref([
  {
    classId: "2311",
    className: "电安一组",
    classDate: "2024-1-20"
    //member: [{ name: "王洋" }, { name: "刘敏" }]
  }
]);

const members = ref([
  {
    phone: "",
    classId: 0,
    realName: "",
    realNameId: 0,
    userId: ""
  }
]);

const creater = ref([
  {
    realName: "",
    userId: ""
  }
]);

const getClass = async () => {
  let result = await getAllClassService();
  groups.value = result.data.data;
  //console.log("班组" + groups.value);
};
onMounted(getClass);

const getCreater = async () => {
  let result = await getAllWorkerService();
  creater.value = result.data.data;
  //console.log("用户列表" + creater.value[0]);
};
onMounted(getCreater);

const getMem = async () => {
  if (taskForm.value.inspectionClassId) {
    let dataObj = {
      classId: taskForm.value.inspectionClassId
    };
    let result = await getClassMemberService(dataObj);
    members.value = result.data.data;
  }
};
// 监听 taskForm.inspectionMapId 的变化
watch(
  () => taskForm.value.inspectionClassId, // 监听的值
  (newVal, oldVal) => {
    console.log("inspectionClassId 变化:", oldVal, "->", newVal); // 调试输出
    getMem();
  }
);

//分页
const total = ref(0);
// searchData-向后端分页查询的对象，即当前页和每页总数
const searchData = reactive({
  current: 1,
  limit: 10
});

const tableData = ref([{}]);

//传入分页参数
const pageQuery = (current, limit) => {
  let begin = current * limit - limit;
  //这里不减一是因为，slice方法裁切是左闭右开数组
  let end = current * limit;
  tableData.value = tasks.value.slice(begin, end);
};

const getData = newPage => {
  searchData.current = newPage;
  total.value = tasks.value.length;
  pageQuery(searchData.current, searchData.limit);
};

//用于转换数据
const convertIsoToChineseDate = isoString => {
  const date = new Date(isoString);
  const year = date.getFullYear();
  const month = (date.getMonth() + 1).toString().padStart(2, "0"); // 月份从0开始，所以加1
  const day = date.getDate().toString().padStart(2, "0");
  return `${year}年${month}月${day}日`;
};

// //用于数据转换
// const convertIdtoRealname = () => {
//   tasks.value.forEach(item1 => {
//     creater.value.forEach(item2 => {
//       console.log("try2" + item2.userId);
//       if (item1.inspectionUserId === item2.userId) {
//         item1.inspectionUserId = item2.realName;
//       }
//     });
//   });
// };
//
// //用于转换数据
// const convertClassIdToName = () => {
//   tasks.value.forEach(item => {
//     groups.value.forEach(group => {
//       if (group.classId === item.inspectionClassId) item.inspectionClassId = group.className;
//     });
//   });
// };

const getTempList = async () => {
  let result = await getAllTempService();
  tasks.value = result.data.data;
  tasks.value.forEach(item => {
    item.inspectionDate = convertIsoToChineseDate(item.inspectionDate);
  });
  // convertClassIdToName();
  // convertIdtoRealname();
  total.value = tasks.value.length;
  console.log("当前长度" + tasks.value.length);
  getData(1);
};
onMounted(getTempList);

const getDetail = async row => {
  let dataObj = {
    inspectionId: row.inspectionId,
    inspectionMapId: row.inspectionMapId
  };
  let result = await getTempDetService(dataObj);
  task.value = result.data.data;
};

const taskDetail = ref<taskForm>({
  inspectionClassId: "",
  inspectionDatas: [],
  inspectionId: null,
  inspectionMapId: "",
  inspectionName: "",
  inspectionUserId: null
});

const getDetailClick = async row => {
  taskDetail.value.inspectionClassId = row.inspectionClassId;
  taskDetail.value.inspectionUserId = row.inspectionUserId;
  taskDetail.value.inspectionName = row.inspectionName;
  taskDetail.value.inspectionMapId = row.inspectionMapId;
  await request.get("/api-self/inspection/template/detail/" + row.inspectionId + "/" + row.inspectionMapId).then(res => {
    const data = res.data;
    if (data.code === 0) {
      const inspectionDatas: any[] = [];
      data.data.forEach(inspectionDetail => {
        const inspectionData = inspectionDetail.inspectionData;
        inspectionData.mapDetailDesc = inspectionDetail.mapDetailVO.mapDetailDesc;
        inspectionDatas.push(inspectionData);
      });
      taskDetail.value.inspectionDatas = inspectionDatas;
    } else {
      ElMessage.error("查询模板详情失败：" + data.message);
    }
  });
  show_task.value = true;
};

const delTask = async row => {
  ElMessageBox.confirm("将会删除这个模板，确定吗？", "警告", {
    confirmButtonText: "确定",
    cancelButtonText: "取消",
    type: "warning"
  }).then(async () => {
    let dataObj = {
      inspectionId: row.inspectionId
    };
    const res = await delTempService(dataObj);
    if (res.data.code === 0) {
      ElMessage.success("删除成功");
      getTempList();
    } else {
      ElMessage.error("删除失败：" + res.data.message);
    }
  });
};

//修改功能
const editClick = row => {
  clearForm();
  taskForm.value.inspectionId = row.inspectionId;
  taskForm.value.inspectionClassId = row.inspectionClassId;
  taskForm.value.inspectionUserId = row.inspectionUserId;
  taskForm.value.inspectionName = row.inspectionName;
  taskForm.value.inspectionMapId = row.inspectionMapId;
  getDetail(row);
  assignTaskToTaskForm();
  show_edit.value = true;
};

const editTask = async () => {
  await request.put("/api-self/inspection/template/" + taskForm.value.inspectionId, taskForm.value).then(res => {
    const data = res.data;
    if (data.code === 0) {
      show_edit.value = false;
      ElMessage.success("修改成功");
      getTempList();
      clearForm();
    } else {
      ElMessage.error("修改失败：" + data.message);
    }
  });
};

const getMaps = async () => {
  let dataObj = {
    pageNum: 1,
    pageSize: 10
  };
  let result = await getAllMapService(dataObj);
  let total = result.data.data.total;
  //console.log(total);
  dataObj.pageSize = total;
  let result2 = await getAllMapService(dataObj);
  maps.value = result2.data.data.maps;
};
onMounted(getMaps);

const getPoints = async () => {
  if (taskForm.value.inspectionMapId) {
    let dataObj = {
      mapId: taskForm.value.inspectionMapId
    };
    let result = await getPointService(dataObj);
    map_points.value = result.data.data;
    assignMapPointsToTaskForm();
  }
};
// 监听 taskForm.inspectionMapId 的变化
watch(
  () => taskForm.value.inspectionMapId, // 监听的值
  (newVal, oldVal) => {
    console.log("inspectionMapId 变化:", oldVal, "->", newVal); // 调试输出
    getPoints(); // 调用获取点的函数
  }
);

const getDatas = async () => {
  let result = await getDataService();
  datas.value = result.data.data;
};
onMounted(getDatas);

const addClick = () => {
  clearForm();
  one.value = true;
};

const addtask = async () => {
  taskForm.value.inspectionUserId = userStore.userInfo.userId;
  await request.post("/api-self/inspection/template", taskForm.value).then(res => {
    if (res.data.code === 0) {
      ElMessage.success("添加成功");
      getTempList();
      add_task_commit.value = false;
      clearForm();
    } else {
      ElMessage.error("添加失败：" + res.data.message);
    }
  });
};

const convertNameToId = name => {
  let result = -1;
  console.log(name);
  if (select.value == "3") {
    creater.value.forEach(item => {
      if (item.realName == name) {
        result = +item.userId;
      }
    });
  } else if (select.value == "2") {
    groups.value.forEach(item => {
      if (item.className == name) {
        result = +item.classId;
      }
    });
  }
  console.log("res" + result);
  return result;
};

const handleSearch = async () => {
  console.log("click");
  let dataObj = {
    inspectionName: "",
    inspectionUserId: -1,
    inspectionClassId: -1
  };
  if (select.value == "1") {
    dataObj.inspectionName = input.value;
  } else if (select.value == "2") {
    dataObj.inspectionUserId = convertNameToId(input.value);
    //转换实名toid
  } else if (select.value == "3") {
    dataObj.inspectionClassId = convertNameToId(input.value);
    //转换班组名toid
  }
  let result = await tempSearchService(dataObj);
  console.log(result);
  searched.value = tasks.value;
  tasks.value = result.data.data;
  tasks.value.forEach(item => {
    item.inspectionDate = convertIsoToChineseDate(item.inspectionDate);
  });
  // convertClassIdToName();
  // convertIdtoRealname();
  total.value = tasks.value.length;
  console.log(tasks.value);
  getData(1);
  tableData.value = tasks.value;
};

const cancelSearch = () => {
  getTempList();
};

//zy
const Next1 = () => {
  if (addFormRef.value) {
    addFormRef.value.validate((valid: boolean) => {
      if (valid) {
        one.value = false;
        two.value = true;
      }
    });
  }
};
const Next2 = () => {
  let flag = true;
  const check = () => {
    taskForm.value.inspectionDatas.forEach(inspectionData => {
      if (
        inspectionData.inspectionGroupId == null ||
        inspectionData.inspectionDataName === "" ||
        inspectionData.inspectionDataDesc === ""
      ) {
        flag = false;
      }
    });
  };
  check();
  if (flag) {
    console.log(taskForm.value.inspectionDatas);
    two.value = false;
    add_task_commit.value = true;
  } else {
    ElMessage.warning("请填写完整点位信息");
  }
};
//查找指定用户名字
// 创建一个响应式对象来存储用户信息
const userCache = reactive({});
const getUserInfo = userId => {
  // 检查缓存，避免重复请求
  if (!userCache[userId]) {
    // 初始设为 '加载中...'，以处理异步过程
    userCache[userId] = "加载中...";
    http
      .get("/users/account/getUserInfo", { params: { userId: userId } })
      .then(res => {
        const data = res.data;
        if (data.code === 0) {
          userCache[userId] = data.data.realName;
        } else {
          userCache[userId] = "未知用户";
        }
      })
      .catch(() => {
        userCache[userId] = "请求失败";
      });
  }
  // 立即返回缓存值，初次时可能是 "加载中..."
  return userCache[userId];
};

//查找指定数据组名字
// 创建一个响应式对象来存储用户信息
const groupCache = reactive({});
const getDataInfo = groupId => {
  console.log("groupId", groupId);
  if (groupId && !groupCache[groupId]) {
    groupCache[groupId] = "加载中...";
    http
      .get("/inspection/data/" + groupId)
      .then(res => {
        const data = res.data;
        if (data.code === 0) {
          let dataStr = "";
          data.data.forEach(data => {
            dataStr += data.attribute + "(" + data.perUnit + ");";
          });
          groupCache[groupId] = dataStr;
        } else {
          groupCache[groupId] = "未知数据组";
        }
      })
      .catch(() => {
        groupCache[groupId] = "请求失败";
      });
  }
  return groupCache[groupId];
};
//查找指定路线名称
// 创建一个响应式对象来存储路线信息
const mapCache = reactive({});

const getMapInfo = mapId => {
  // 检查缓存，避免重复请求
  if (!mapCache[mapId]) {
    // 初始设为 '加载中...'，以处理异步过程
    mapCache[mapId] = "加载中...";
    const temp = maps.value.find(map => map.mapId === mapId);
    if (temp) mapCache[mapId] = temp.mapName;
    else mapCache[mapId] = "未知路线";
  }
  return mapCache[mapId];
};

const selected = () => {
  return true;
};
</script>

<style scoped>
.el-button {
  border-radius: 6px;
}
.demo-tabs > .el-tabs__content {
  padding: 32px;
  font-size: 32px;
  font-weight: 600;
  color: #6b778c;
}
.demo-tabs {
  margin-top: -20px;
}
.topadd {
  position: absolute;
  top: 73px;
  right: 40px;
}
.page-container {
  box-sizing: border-box;
  min-height: 100%;
}
.add {
  position: absolute;
  top: 80%;
  right: 3%;
  float: left;
  width: 60px;
  height: 60px;
  font-size: 50px;
  font-weight: 600;
  border-radius: 50%;
}
.inneradd {
  position: absolute;
  top: 55px;
  right: 30px;
  float: left;
  font-weight: 900;
}
.avatar-uploader .avatar {
  display: block;
  width: 178px;
  height: 178px;
}
.avatar-uploader .el-upload {
  position: relative;
  overflow: hidden;
  cursor: pointer;
  border: 1px dashed var(--el-border-color);
  border-radius: 6px;
  transition: var(--el-transition-duration-fast);
}
.avatar-uploader .el-upload:hover {
  border-color: var(--el-color-primary);
}
.el-icon.avatar-uploader-icon {
  width: 178px;
  height: 178px;
  font-size: 28px;
  color: #060707;
  text-align: center;
}
:deep(.my-label) {
  background: var(--el-color-success-light-9) !important;
}
:deep(.my-content) {
  background: var(--el-color-danger-light-9);
}
.Product-image {
  width: auto; /* 图片宽度自适应 */
  max-width: 100%; /* 图片最大宽度为其容器的100% */
  height: auto; /* 图片高度自适应 */
  max-height: 100%; /* 图片最大高度为其容器的100% */
}
.custom-table :deep(.el-table__header-wrapper thead tr th) {
  color: #000000;
  text-align: center;
  background-color: #fafafa;
}
.custom-table :deep(.el-table__body-wrapper tbody tr td) {
  text-align: center; /* 单元格内容居中 */
}
</style>
